import { createRouter, createWebHistory } from 'vue-router'
import store from '@/store'
import { ElMessage } from 'element-plus'

// 路由组件懒加载
const Login = () => import('@/views/Login.vue')
const Register = () => import('@/views/Register.vue')
const Home = () => import('@/views/Home.vue')

// 用户端路由
const UserLayout = () => import('@/layouts/UserLayout.vue')
const UserDashboard = () => import('@/views/user/Dashboard.vue')
const UserProfile = () => import('@/views/user/Profile.vue')
const UserCards = () => import('@/views/user/Cards.vue')
const UserTransfer = () => import('@/views/user/Transfer.vue')
const UserAccount = () => import('@/views/user/Account.vue')
const UserTrades = () => import('@/views/user/Trades.vue')

// 管理员端路由
const AdminLayout = () => import('@/layouts/AdminLayout.vue')
const AdminDashboard = () => import('@/views/admin/Dashboard.vue')
const CustomerManage = () => import('@/views/admin/CustomerManage.vue')
const CardManage = () => import('@/views/admin/CardManage.vue')
const DepositManage = () => import('@/views/admin/DepositManage.vue')
const TradeManage = () => import('@/views/admin/TradeManage.vue')

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    meta: { title: '银行管理系统' }
  },
  {
    path: '/login',
    name: 'Login',
    component: Login,
    meta: { title: '登录' }
  },
  {
    path: '/register',
    name: 'Register',
    component: Register,
    meta: { title: '注册' }
  },
  // 用户端路由
  {
    path: '/user',
    component: UserLayout,
    meta: { 
      requiresAuth: true,
      requiresUser: true,
      title: '用户端'
    },
    children: [
      {
        path: '',
        redirect: '/user/dashboard'
      },
      {
        path: 'dashboard',
        name: 'UserDashboard',
        component: UserDashboard,
        meta: { title: '用户首页' }
      },
      {
        path: 'account',
        name: 'UserAccount',
        component: UserAccount,
        meta: { title: '个人信息' }
      },
      {
        path: 'cards',
        name: 'UserCards',
        component: UserCards,
        meta: { title: '我的银行卡' }
      },
      {
        path: 'transfer',
        name: 'UserTransfer',
        component: UserTransfer,
        meta: { title: '转账汇款' }
      },
      {
        path: 'trades',
        name: 'UserTrades',
        component: UserTrades,
        meta: { title: '交易记录' }
      }
    ]
  },
  // 管理员端路由
  {
    path: '/admin',
    component: AdminLayout,
    meta: { 
      requiresAuth: true,
      requiresAdmin: true,
      title: '管理员端'
    },
    children: [
      {
        path: '',
        redirect: '/admin/dashboard'
      },
      {
        path: 'dashboard',
        name: 'AdminDashboard',
        component: AdminDashboard,
        meta: { title: '管理员首页' }
      },
      {
        path: 'customers',
        name: 'AdminCustomers',
        component: CustomerManage,
        meta: { title: '客户管理' }
      },
      {
        path: 'cards',
        name: 'AdminCards',
        component: CardManage,
        meta: { title: '银行卡管理' }
      },
      {
        path: 'deposits',
        name: 'AdminDeposits',
        component: DepositManage,
        meta: { title: '存款类型管理' }
      },
      {
        path: 'trades',
        name: 'AdminTrades',
        component: TradeManage,
        meta: { title: '交易管理' }
      }
    ]
  },
  // 404 页面
  {
    path: '/:pathMatch(.*)*',
    name: 'NotFound',
    component: () => import('@/views/NotFound.vue'),
    meta: { title: '页面不存在' }
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

// 路由守卫
router.beforeEach((to, from, next) => {
  // 设置页面标题
  document.title = to.meta.title ? `${to.meta.title} - 银行管理系统` : '银行管理系统'

  // 检查是否需要认证
  if (to.meta.requiresAuth) {
    if (!store.getters.isLoggedIn) {
      ElMessage.warning('请先登录')
      next('/login')
      return
    }

    // 检查用户权限
    if (to.meta.requiresAdmin && !store.getters.isAdmin) {
      ElMessage.error('权限不足，无法访问管理员页面')
      next('/user')
      return
    }

    if (to.meta.requiresUser && !store.getters.isUser) {
      ElMessage.error('权限不足，无法访问用户页面')
      next('/admin')
      return
    }
  }

  // 如果已登录，访问登录页面则重定向到对应的首页
  if (to.path === '/login' && store.getters.isLoggedIn) {
    if (store.getters.isAdmin) {
      next('/admin')
    } else {
      next('/user')
    }
    return
  }

  next()
})

export default router 